import React, { Component } from 'react';
import { TextInput, StatusBar, View, Image, Text, TouchableOpacity } from 'react-native';
import Colors from '../constants/Colors';
import { unitWidth, unitHeight } from '../constants/AdapterUtil';
import { IconInput } from '../components/Input';
import TextUtil from '../constants/TextUtil';
import { SubmitButton1, SubmitButton2 } from '../components/Button';

export default class ChooseRegisterScreen extends Component {

    constructor(props) {
        super(props)
        this.state = {
            currentChoose: 1,
        }
    }

    componentDidMount() {

    }

    render() {
        return (
            <View style={{ flex: 1, alignItems: 'center' }}>
                <Text style={{ fontSize: 21, color: Colors.color33, marginTop: 120 * unitWidth }}>-请选择身份-</Text>
                <View style={{ flexDirection: 'row', marginTop: 76 * unitWidth, width: 250 * unitWidth, justifyContent: 'space-between' }}>
                    <TouchableOpacity style={{ alignItems: 'center' }} activeOpacity={0.7} onPress={() => {
                        this.setState({
                            currentChoose: 1
                        })
                    }}>
                        <Image style={{ width: 85 * unitWidth, height: 105 * unitWidth }} source={require('../res/ic_gryh.png')} resizeMode='stretch' />
                        <View style={{ flexDirection: 'row', alignItems: 'center', marginTop: 10 * unitWidth }}>
                            <Text style={{ fontSize: 16, color: Colors.color66 }}>个人用户</Text>
                            <Image style={{ width: 18 * unitWidth, height: 18 * unitWidth, marginLeft: 5 * unitWidth }} source={this.state.currentChoose == 1 ? require('../res/ic_choose_c.png') : require('../res/ic_choose_n.png')} resizeMode='stretch' />
                        </View>
                    </TouchableOpacity>
                    <TouchableOpacity style={{ alignItems: 'center' }} activeOpacity={0.7} onPress={() => {
                        this.setState({
                            currentChoose: 2
                        })
                    }}>
                        <Image style={{ width: 85 * unitWidth, height: 105 * unitWidth }} source={require('../res/ic_gsyh.png')} resizeMode='stretch' />
                        <View style={{ flexDirection: 'row', alignItems: 'center', marginTop: 10 * unitWidth }}>
                            <Text style={{ fontSize: 16, color: Colors.color66 }}>公司用户</Text>
                            <Image style={{ width: 18 * unitWidth, height: 18 * unitWidth, marginLeft: 5 * unitWidth }} source={this.state.currentChoose == 2 ? require('../res/ic_choose_c.png') : require('../res/ic_choose_n.png')} resizeMode='stretch' />
                        </View>
                    </TouchableOpacity>
                </View>
                <SubmitButton1 style={{ marginTop: 100 * unitWidth }} text='选好了，立即注册' onPress={() => {
                    if (this.state.currentChoose == 1) {
                        this.props.navigation.navigate('Register');
                    } else {
                        this.props.navigation.navigate('CompanyRegister');
                    }
                }} />
            </View>
        )
    }
}